<template>
  <div class="p-4 space-y-4">
    <div class="text-xl font-bold text-blue-700 mb-2">usePut</div>
    <div class="text-gray-700 mb-2">PUT 请求封装，支持 body，基于 useRequest + axiosInstance。</div>
    <div class="bg-white rounded-xl p-4 shadow">
      <div class="font-bold mb-2 text-blue-600">用法</div>
      <pre class="bg-blue-50 rounded p-3 text-sm text-blue-700 overflow-x-auto">
const { data, run, loading } = usePut('/api/user/update')
// 传递 body 数据
run({ id: 1, username: 'newName' })</pre
      >
    </div>
    <div class="bg-white rounded-xl p-4 shadow">
      <div class="font-bold mb-2 text-green-600">示例1</div>
      <pre class="bg-green-50 rounded p-3 text-sm text-green-700 overflow-x-auto">
const { data, run } = usePut('/api/product/1')
run({ price: 199.99 })</pre
      >
    </div>
    <div class="bg-white rounded-xl p-4 shadow">
      <div class="font-bold mb-2 text-green-600">示例2</div>
      <pre class="bg-green-50 rounded p-3 text-sm text-green-700 overflow-x-auto">
const { data, run } = usePut('/api/user/2', { manual: true })
run({ status: 'active' })</pre
      >
    </div>
    <div class="bg-white rounded-xl p-4 shadow border-l-4 border-blue-400">
      <div class="font-bold mb-2 text-gray-700">说明</div>
      <div class="text-xs text-gray-600 leading-relaxed">
        适用于 PUT 更新接口，支持自动/手动请求、loading、错误处理等。<br />
        依赖 axiosInstance 和 vue-request，body 数据会自动作为请求体传递。
      </div>
    </div>
  </div>
</template>
